<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script LANGUAGE="JavaScript">
	$(function() {
		$('#fullscreen').click(function() {
			var docElm = document.documentElement;
			if (docElm.requestFullscreen) {
				docElm.requestFullscreen();
			} else if (docElm.msRequestFullscreen) {
				docElm.msRequestFullscreen();
			} else if (docElm.mozRequestFullScreen) {
				docElm.mozRequestFullScreen();
			} else if (docElm.webkitRequestFullScreen) {
				docElm.webkitRequestFullScreen();
			}
		});
		$('#unfullscreen').click(function() {
			if (document.exitFullscreen) {
				document.exitFullscreen();
			} else if (document.msExitFullscreen) {
				document.msExitFullscreen();
			} else if (document.mozCancelFullScreen) {
				document.mozCancelFullScreen();
			} else if (document.webkitCancelFullScreen) {
				document.webkitCancelFullScreen();
			}
		});
		//监控浏览器状态
		document.addEventListener("fullscreenchange", function() {
			if (document.fullscreen) {
				$('#fullscreen').hide();//全屏
				$('#unfullscreen').show();
			} else {
				$('#unfullscreen').hide();//小屏
				$('#fullscreen').show();
			}
		});

		document.addEventListener("mozfullscreenchange", function() {
			if (document.mozFullScreen) {
				$('#fullscreen').hide();//全屏
				$('#unfullscreen').show();
			} else {
				$('#unfullscreen').hide();//小屏
				$('#fullscreen').show();
			}
		});

		document.addEventListener("webkitfullscreenchange", function() {
			if (document.webkitIsFullScreen) {
				$('#fullscreen').hide();//全屏
				$('#unfullscreen').show();
			} else {
				$('#unfullscreen').hide();//小屏
				$('#fullscreen').show();
			}
		});
	});
</script>
</head>

<body>
	<button id="fullscreen">全屏</button>
	<button id="unfullscreen" style="display: none;">退出全屏</button>
	<label>11111111111111111111</label>
</body>
</html>
